import Vue from 'vue'
import Vuex from 'vuex'
//导入axios
import axios from 'axios'

Vue.prototype.$http = axios;



Vue.use(Vuex)

export default new Vuex.Store({
    state: {
        //所有任务列表
        list: [],
        //用来存放搜索框内容
        inputValue: ""
    },
    mutations: {
        //添加list  用于更新数据
        addList(state, list) {
            state.list = list;
        },
        //用来实时更新搜索框内容
        updateInputValue(state, newInputValue) {
            state.inputValue = newInputValue;
        },
        //添加list数据
        addListItem(state, newText) {
            const item = {
                id: state.list.length + 1,
                text: newText,
                checked: false
            }
            state.list.push(item);
            //添加完毕后清空
            state.inputValue = "";
        },
        //移除对应任务
        removeListItem(state, id) {
            state.list.some((value, index) => {
                if (value.id == id) {
                    state.list.splice(index, 1)
                    return true;
                }
            });
            // state.list.splice(从第几个开始删除,删除几个[,插入项(多个用数组写)])
        },
        //复选框状态修改
        changeListItemChecked(state, id) {
            state.list.some((value, index) => {
                if (value.id == id) {
                    value.checked = !value.checked;
                    return true;
                }
            });
        },
        //清除已完成事情
        clearDone(state) {
            state.list = state.list.filter((value, index) => {
                return value.checked == false;
            });
        }
    },
    actions: {
        //获取list数据
        getList(context) {
            axios.get('/List.json').then((ret) => {
                console.log(ret.data);
                context.commit('addList', ret.data)
            })
        }
    },
    getters: {
        //计算剩余多少条事件未完成
        UndownThings(state) {
            return state.list.filter((value) => { return value.checked == false }).length;
        }
    },
    modules: {}
})